【krpano】画像をクリックした時に画像の大きさを変える

パノラマ上に配置した特定の画像をクリックした時に、その画像を拡大縮小する方法。
マップ等を配置して、クリックする事で大きく表示させてマップをはっきり見えるようにするなどの場面で使える。

【使用するファイル】
xmlファイル
拡大縮小する画像

【基本コード】
以下のコードをxmlに記述する

<plugin name="sampleimage"
url="sampleimage.jpg"
align="center"
x="0"
y="0"
keep="false"
scale="0.2"
destscale="5.0"
onclick="IF(plugin[sampleimage].scale == 5.0, tween(plugin[sampleimage].scale,0.2), tween(plugin[sampleimage].scale,5.0));"
/>

解説

<plugin name="sampleimage" //画像のID
url="sampleimage.jpg" //画像のパス　xmlから見たパス
align="center" //画像の基本の位置
x="0" //画像の基本の位置から横位置移動の距離
y="0" //画像の基本の位置から縦位置移動の距離
keep="false" //別のパノラマへ移動した際にも効果を引き継ぐかどうか。共通のマップなどの場合はtrueにする。
scale="0.2" //最初に表示する画像の倍率
destscale="5.0" //サイズ変更した時のサイズ　もとより大きくしたい場合はscale より大きくする
onclick="IF(plugin[sampleimage].scale == 5.0, tween(plugin[sampleimage].scale,0.2), tween(plugin[sampleimage].scale,5.0));"
/>

【メモ】
onclick=”IF(plugin[logo].scale == 5.0, tween(plugin[logo].scale,0.2), tween(plugin[logo].scale,5.0));”
クリック毎に5倍〜1倍の間で拡大縮小が繰り返される

【応用】
画像にマウスオーバーしてテキストを表示させて画像をクリックで拡大縮小する。
画像用コード

<plugin name="logo"
url="logo.jpg"
align="center"
x="0"
y="0"
scale="0.2"
destscale="5.0"
scalechildren="true"
onclick="IF(plugin[logo].scale == 5.0, tween(plugin[logo].scale,0.2), tween(plugin[logo].scale,5.0));"
onhover="showtext(表示させる文字, infostyle)"
/>

文字の設定コード

<textstyle
 name="infostyle"
 font="Times"
 fontsize="50.0"
 bold="true"
 background="false"
 border="false"
 origin="center"
 textcolor="0xFFFFFF"
 fadeintime="0.5"
 fadetime="0.5"
 />
  

【実例】

</krpano>